<template>
 <div class="div">
  <van-sticky>
    <!-- 头部标签栏 -->
    <van-nav-bar title="经典活动美食" left-arrow @click-left="$router.push('/home/activity')">
      <template #right>
        <van-icon name="search" size="18" />
      </template>
    </van-nav-bar>
  </van-sticky>

  <!-- 内容 -->
  <van-notice-bar scrollable :text="topicxs.title" />
  <van-pull-refresh @refresh="handleRefresh" style="text-align: center;">
    <img class="pic" :src="topicxs.images"
      alt="羊肉泡馍图片" />
    <p style="width: 100%; background-color: burlywood; margin: 10px 0 10px 0;">------------产品介绍-----------------------------------</p>
    <p class="font">{{ topicxs.texta }}</p>
  </van-pull-refresh>
</div>
</template>
  
<script setup>

import myaxios from "@/http/MyAxios";
    import { onBeforeMount,ref } from "vue";
    import { useRoute} from "vue-router";
    const $route=useRoute()
    const test=ref('1')

     const topicxs = ref({});
     onBeforeMount(() => {
        console.log($route.query.id);
        console.log(test);
        let url = `http://127.0.0.1:5000/actweek/actweekthree/id?id=${$route.query.id}`;
        myaxios.get(url).then((res) => {
            console.log("资讯详情查询结果", res);
            topicxs.value = res.data.data
            console.log(topicxs);
        });
    });



</script>
  
<style lang="scss" scoped>
.div {
  position: relative;
  font-size: 19px;
  /* 设置字体大小为16像素 */
}

.span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 100px;
  /* 设置字体大小为18像素 */
}

.pic {
  width: 100%;
}

.font {
  width: 90%;
  margin-left: auto;
  margin-right: auto;


}
</style>